<template>
	<view class="transfer-balance">
		<view class="" v-if="type == 0"></view>

		<view v-else-if="type == 1">
			<view class="balance">
				<view class="rice">
					<text class="text">可转赠购物积分:</text>
					<text class="price">{{ integral }}</text>
				</view>
			</view>

			<view class="balance">
				<view class="rice1"><text class="text1">转赠购物积分</text></view>
				<view class="input">
					<view class="text">转赠账号</view>
					<input type="text" v-model="mobile" class="input-value" value="" placeholder="请输入转赠账号" />
					<view class="all"></view>
				</view>

				<view class="input">
					<view class="text">转赠数量</view>
					<input type="text" v-model="amount" class="input-value" value="" placeholder="请输入转赠的购物积分" />
					<view class="all">
						<text>|</text>
						<text class="all-text" @click="getAll(integral)">全部</text>
					</view>
				</view>
				<view class="input">
					<view class="text">交易密码</view>
					<input type="password" v-model="pay" class="input-value" value="" placeholder="请输入交易密码" maxlength="6" />
					<view class="all"></view>
				</view>

				<view class="transfer" @click="roll" v-if="status == 1">转赠</view>
				<view class="transfer" v-else>转赠</view>

				<view class="tips">购物积分转赠到对方账户不可逆转，请确认对方账户！</view>

				<view style="height: 60upx;"></view>
			</view>
		</view>

		<view v-else-if="type == 2">
			<view class="balance">
				<view class="rice">
					<text class="text">可提现购物积分:</text>
					<text class="price">{{ integral }}</text>
				</view>
			</view>

			<view class="balance">
				<view class="rice1"><text class="text1">购物积分提现</text></view>
				<view class="input">
					<view class="text">开户行名称</view>
					<input type="text" v-model="cardname" class="input-value" value="" placeholder="请输入开户行名称" />
					<view class="all"></view>
				</view>

				<view class="input">
					<view class="text">真实姓名</view>
					<input type="text" v-model="nickname" class="input-value" value="" placeholder="请输入真实姓名" />
					<view class="all"></view>
				</view>

				<view class="input">
					<view class="text">银行账号</view>
					<input type="text" v-model="account" class="input-value" value="" placeholder="请输入提现的银行账号" />
					<view class="all"></view>
				</view>

				<view class="input">
					<view class="text">提现数量</view>
					<input type="text" v-model="amount" class="input-value" value="" placeholder="请输入提现的购物积分" @input="wither" />
					<view class="all">
						<!-- <text>|</text>
						<text class="all-text" @click="getAll(integral)">全部</text> -->
					</view>
				</view>

				<view class="transfer" @click="withdrawal" v-if="status == 1">提现</view>
				<view class="transfer" v-else>提现</view>

				<view class="tips">提现手续费6%，提现周期为T+1个工作日！</view>
				<view class="tips">每次提现的金额不能小于100，且需要是100的倍数！</view>

				<view style="height: 60upx;"></view>
			</view>
		</view>

		<view v-else>
			<view class="balance">
				<view class="rice1"><text class="text1">充值购物积分</text></view>
				<view class="input">
					<view class="text">充值数量</view>
					<input type="text" v-model="number" class="input-value" value="" placeholder="请输入充值购物积分数量" />
					<view class="all"></view>
				</view>

				<view class="input">
					<view class="text">上传凭证</view>
					<view class="input-value" @click="cloose"><image :src="imgsrc != '' ? imgsrc : '/static/card/add.png'" mode="" class="input-img"></image></view>
					<view class="all"></view>
				</view>
				<view style="height: 60upx;"></view>

				<view class="tips">数量要求：最小1000，最大值600000，基数10000</view>

				<view class="transfer" @click="recharge" v-if="status == 1">充值</view>
				<view class="transfer" v-else>充值</view>

				<view style="height: 60upx;"></view>
			</view>
		</view>
	</view>
</template>

<script>
import service from '@/store/service.js';
export default {
	data() {
		return {
			type: 3,
			integral: '0.00',
			mobile: '',
			account: '',
			cardname: '',
			nickname: '',
			amount: '',
			number: '',
			imgsrc: '',
			status: 1,
			pay: ''
		};
	},
	onLoad: function(e) {
		var self = this;
		self.type = e.type;
		self.$http.post(service.api.user.info).then(function(res) {
			if (res.code == 1) {
				res = res.data;
				self.integral = res.credit3;
			} else {
				self.$api.msg(res.msg);
			}
		});
	},
	methods: {
		//全部米粒
		getAll(num) {
			// console.log(num);
			this.amount = num;
		},
		// 转出购物积分
		roll() {
			var self = this;
			if (self.mobile == '') {
				self.$api.msg('转赠账号不能为空');
				return;
			}
			if (self.amount == '' || self.amount < 1) {
				self.$api.msg('转赠的购物积分不能小于0');
				return;
			}
			self.$http
				.post(service.api.user.give, {
					number: self.amount,
					account: self.mobile,
					transaction_pw: self.pay
				})
				.then(function(res) {
					self.$api.msg(res.info);
					if (res.code == 1) {
						setTimeout(function() {
							uni.navigateBack({
								delta: 1
							});
						}, 1500);
					}
				});
		}
	}
};
</script>

<style scoped>
.balance {
	background-color: #fff;
	border-radius: 20upx;
	margin: 30upx 20upx;
}
.rice {
	padding: 30upx;
	border-bottom: 1px solid #f4f4f4;
}
.text {
	width: 140upx;
	font-size: 26upx;
	font-weight: bold;
	margin-right: 16upx;
}
.rice1 {
	padding: 30upx;
}
.text1 {
	font-size: 28upx;
	font-weight: bold;
}

.price {
	font-size: 32upx;
	font-weight: bold;
	color: #ff594d;
}
.img {
	width: 68upx;
	height: 16upx;
}
.top {
	display: flex;
	align-items: center;
	justify-content: space-around;
	height: 160upx;
}
.top-text {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.rice-text {
	color: #333;
	font-size: 32upx;
	font-weight: bold;
}
.txt {
	font-size: 24upx;
	color: #666;
}
.input {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 30upx;
	border-bottom: 1px solid #f4f4f4;
	padding: 20upx 0;
}
.input-value {
	font-size: 28upx;
	color: #999;
	width: calc(100% - 220upx);
}
.input-img {
	width: 200upx;
	height: 200upx;
}
.all {
	width: 80upx;
	color: #ff594d;
}
.all-text {
	margin-left: 8upx;
}
.transfer {
	color: #fff;
	background: #ff594d;
	border-radius: 10upx;
	height: 100upx;
	width: 618upx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 36upx;
	margin: 30upx 46upx 30upx 46upx;
}
.tips {
	display: flex;
	justify-content: center;
	font-size: 24upx;
	color: #999;
}
</style>
